<template>



  <div class="app-container">
    <h2 style="text-align: center;">{{$route.query.title}}课程</h2>
    <el-steps :active="active" finish-status="success" simple style="margin-bottom: 40px">
      <el-step title="章节基本信息" />
      <el-step title="添加编辑章节" />
      <el-step title="上传视频" />
    </el-steps>


    <Chapter v-if="active === 0" />

    <ChapterAdd  :value="courseId" :chaId="chaId" v-if="active === 1" />

    <UploadVideo :value="courseId" :chaId="chaId"  v-if="active === 2 || active === 3" />
  </div>




</template>

<script>

import Chapter from "./Chapter.vue";
import UploadVideo from "./UploadVideo.vue";
import ChapterAdd from "./ChapterAdd.vue";

export default {
  name: "CourseInfo",
  components:{Chapter,UploadVideo,ChapterAdd},
  data() {
    return {
      active: 0,
      courseId: null,
      chaId:1,//兄弟组件传值中间值

    }
  },
  watch:{
    '$route':'init'
  },
  created() {
    // 获取路由id
    this.init()
  },
  methods: {
    init(){
      if (this.$route.query.courseId) {
        this.courseId = this.$route.query.courseId
      }
      console.log("-------------",this.courseId )
    },

  }

}
</script>

<style scoped>

</style>